import { useNavigate } from 'react-router-dom'
import { Button, ButtonProps } from 'antd'
import { useAuth } from './useAuth'
import { ROUTES } from '../../router/routes'

interface AuthButtonProps extends ButtonProps {
  children: React.ReactNode
}

function AuthButton({
  children,
  onClick,
  ...buttonProps
}: AuthButtonProps) {
  const { isLoggedIn } = useAuth()
  const navigate = useNavigate()

  const handleClick = (e: React.MouseEvent<HTMLElement>) => {
    if (!isLoggedIn) {
      // 未登录时跳转到登录页
      navigate(ROUTES.LOGIN)
      return
    }
    onClick?.(e)
  }

  return (
    <Button onClick={handleClick} {...buttonProps}>
      {children}
    </Button>
  )
}

export default AuthButton